<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%-- 引入页面头 --%>
<%@ include file="/pageHead.jsp"%>
<%@ page import="com.wowangz.cms.syscore.api.UserContext"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" %>
<%@ page import="com.wowangz.cms.common.utils.SysConstant" %>
<%@ page import="com.wowangz.cms.syscore.api.AuthorityUtils" %>
<%@ page import="com.wowangz.cms.syscore.utils.MessageResourcesUtils"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<c:set var="systemctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<meta http-equiv="Cache-Control" content="no-store"/>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Expires" content="0"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="renderer" content="webkit"/>
<link rel="shortcut icon" type="image/ico" href="${systemctx }/resources/images/favicon.ico">
<link rel="stylesheet" type="text/css"  href="${systemctx }/resources/css/translator/style.css" />
<link rel="stylesheet" type="text/css"  href="${systemctx }/resources/css/translator/reset.css" />
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="main_frameid" class="pad-10" style="_margin-right:-12px;_width:98.9%;">
    <div class="warp">
        <div class="inner">
            <h2>基本信息</h2>

            <div class="inner-form">
                <p><span class="span-left">译员手机号</span><input type="text" name="phone" id="phone" class="inp"/><i>*</i></p>
                <p><span class="span-left">译员邮箱</span><input type="text" name="email" id="email" class="inp"/><i>*</i></p>
                <p><span class="span-left">译员登陆密码</span><input type="password" name="password" id="password" class="inp"/><i>*</i></p>
                <p><span class="span-left">译员昵称</span><input type="text" name="nickName" id="nickName" class="inp"/><i>*</i></p>
                <p><span class="span-left">译员真实姓名</span><input type="text" name="trueName" id="trueName" class="inp"/><i>*</i></p>
                <p><span class="span-left">译员国籍</span>
                    <select name="country" id="country" class="slt">
                        <option value="英国" code-val="+44">英国</option>
                        <option value="中国" code-val="+86">中国</option>
						<option value="美国" code-val="+01">美国</option>
						<option value="日本" code-val="+81">日本</option>
						<option value="法国" code-val="+33">法国</option>
						<option value="德国" code-val="+49">德国</option>
						<option value="俄罗斯" code-val="+07">俄罗斯</option>
						<option value="韩国" code-val="+82">韩国</option>
						<option value="荷兰" code-val="+31">荷兰</option>
						<option value="意大利" code-val="+39">意大利</option>
						<option value="西班牙" code-val="+34">西班牙</option>
						<option value="葡萄牙" code-val="+351">葡萄牙</option>
						<option value="泰国" code-val="+66">泰国</option>
						<option value="阿尔及利亚" code-val="+213">阿尔及利亚</option>
						<option value="安哥拉" code-val="+244">安哥拉</option>
						<option value="南非" code-val="+27">南非</option>
						<option value="加蓬" code-val="+241">加蓬</option>
						<option value="巴西" code-val="+55">巴西</option>
						<option value="乌克兰" code-val="+380">乌克兰</option>
						<option value="委内瑞拉" code-val="+58">委内瑞拉</option>
						<option value="阿根廷" code-val="+54">阿根廷</option>
						<option value="洪都拉斯" code-val="+504">洪都拉斯</option>
						<option value="墨西哥" code-val="+52">墨西哥</option>
						<option value="巴拉圭" code-val="+595">巴拉圭</option>
						<option value="波多黎各" code-val="+1787">波多黎各</option>
						<option value="马来西亚" code-val="+60">马来西亚</option>
						<option value="孟加拉" code-val="+880">孟加拉</option>
						<option value="白俄罗斯" code-val="+375">白俄罗斯</option>
						<option value="新加坡" code-val="+65">新加坡</option>
						<option value="澳大利亚" code-val="+61">澳大利亚</option>
						<option value="加拿大" code-val="+01">加拿大</option>
						<option value="爱尔兰" code-val="+353">爱尔兰</option>
						<option value="菲律宾" code-val="+63">菲律宾</option>
						<option value="印度" code-val="+91">印度</option>
						<option value="印度尼西亚" code-val="+62">印度尼西亚</option>
						<option value="塞内加尔" code-val="+221">塞内加尔</option>
                    </select>
                </p>
                <p><span class="span-left">译员母语</span>
                    <select name="srcLangId" id="srcLangId" class="slt">
                        <option value="1">中文</option>
						<option value="2">英文</option>
						<option value="3">日文</option>
						<option value="4">法文</option>
						<option value="5">德文</option>
						<option value="6">俄文</option>
						<option value="7">韩文</option>
						<option value="9">荷兰语</option>
						<option value="10">意大利语</option>
						<option value="11">西班牙文</option>
						<option value="12">葡萄牙语</option>
						<option value="20">泰语</option>
                    </select>
                </p>
                <p><span class="span-left">译员类型：</span>
                	<select name="translatorType" id="translatorType" class="slt">
                        <option value="FULL_TIME">专职</option>
						<option value="PART_TIME">兼职</option>
                    </select>
                </p>
                <p><span class="span-left">译员标签：</span>
                	<c:forEach items="${tagList}" var="tag" >
                		<input type="checkbox" name="translatorTags" value="${tag.tagName}">${tag.tagDesc }
                	</c:forEach>
                </p>
                <p id="ablity_div">
                	<span class="span-left" name="ability_label">译员第1外语</span>
                    <select name="ablityIds" class="slt">
                        <option value="1">中文</option>
						<option value="2">英文</option>
						<option value="3">日文</option>
						<option value="4">法文</option>
						<option value="5">德文</option>
						<option value="6">俄文</option>
						<option value="7">韩文</option>
						<option value="9">荷兰语</option>
						<option value="10">意大利语</option>
						<option value="11">西班牙文</option>
						<option value="12">葡萄牙语</option>
						<option value="20">泰语</option>
                    </select>
                </p>
            </div>
            <div style="text-align: center;margin-bottom: 20px;">
				<input type="button" id="addbtn" value="添加语种能力" class="btn addBtn"/>
				<input type="submit" id="submitbtn" value="创建" class="btn createBtn"/>
			</div>
        </div>
    </div>
</div>
<script type="text/javascript" src="${systemctx }/resources/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="${systemctx }/resources/bootstrap/bootstrap.min.js"></script>
<script type="text/javascript" src="${systemctx }/resources/js/jquery.md5.js"></script>
<script type="text/javascript" src="${systemctx }/resources/js/iol-common.js"></script>
<script type="text/javascript" src="${systemctx }/resources/js/artDialog4/jquery.artDialog.source.js?skin=transnPhone" type="text/javascript"></script>
<script type="text/javascript" src="${systemctx }/resources/js/artDialog4/plugins/iframeTools.source.js" type="text/javascript"></script>
<script type="text/javascript">
	var idIndex = 2;
	jQuery(document).ready(function() {   
		$("#submitbtn").click(function(){
			var phone = $("#phone").val();
			if(isNullOrEmpty(phone)) {
       			artDialog.phoneAlert("手机号不能为空");
       			return ;
       		}
// 			else{
// 				if(!isPhone(phone)){
// 	            	artDialog.phoneAlert("手机号不合法");
// 	            	return ;
// 	            }
//        		}
			var email = $("#email").val();
			if(isNullOrEmpty(email)) {
       			artDialog.phoneAlert("邮箱不能为空");
       			return ;
       		}else{
       			if(!isEmail(email)){
	            	artDialog.phoneAlert("邮箱不合法");
	            	return ;
	            }
       		}
			var password = $("#password").val();
			if(isNullOrEmpty(password)) {
       			artDialog.phoneAlert("密码不能为空");
       			return ;
       		}else{
				password = $.md5(password);
       		}
			var translatorType = $('#translatorType option:selected').attr('value');
			var accountType = "Phone";
			var nickName = $("#nickName").val();
			if(isNullOrEmpty(nickName)) {
       			artDialog.phoneAlert("昵称不能为空");
       			return ;
       		}
			var trueName = $("#trueName").val();
			if(isNullOrEmpty(trueName)) {
       			artDialog.phoneAlert("真名不能为空");
       			return ;
       		}
			var country = $('#country option:selected').attr('value');
			var countryCode = $('#country option:selected').attr('code-val');
            if('' == countryCode || null == countryCode){
               	countryCode = "+86";
            }
			var srcLangId = $('#srcLangId option:selected').attr('value');
			
			var tagArray = new Array();
			var translatorTags = "";
			$("input[name='translatorTags']").each(function(){
				if ($(this).is(':checked')) {
					tagArray.push($(this).val());
			    }
			});
			if(tagArray.length > 0){
				translatorTags = tagArray.join(',');
			}
			var ablityIdArray = [];
			$("select[name='ablityIds']").each(function(index, element){
				ablityIdArray[index] = $(this).val();
			});
			if(ablityIdArray.length > 0){
               	ablityIdArray[ablityIdArray.length] = $("select[name='srcLangId']").val();
               	ablityIdArray.sort();
               	for(var i = 0; i < ablityIdArray.length - 1; i++){
               		if(ablityIdArray[i] == ablityIdArray[i+1]){
               			artDialog.phoneAlert("语种能力重复");
               			return ;
               		}
               	}
			}
			var ablityIds = ablityIdArray.join(",");
			$.ajax({  
    	        url : "saveTranslator.json",  
    	        async : false, // 注意此处需要同步，因为返回完数据
    	        type : "POST",
    	        data : {
    	        	"accountType" : accountType, 
    	        	"phone" : phone, 
    	        	"email" : email, 
    	        	"password" : password,
    	        	"translatorType" : translatorType,
    	        	"nickName" : nickName,
    	        	"trueName" : trueName,
    	        	"srcLangId" : srcLangId,
    	        	"country" : country,
    	        	"countryCode" : countryCode,
    	        	"ablityIds" : ablityIds,
    	        	"translatorTags" : translatorTags
    	        },
    	        dataType : "json",  
    	        success : function(jsonResult) {  
    	        	if(jsonResult.result == '1'){
    	        		artDialog.phoneAlert("译员创建成功", function(){
							window.location.reload();
    	        		});
    	        	} else {
   	        			artDialog.phoneAlert(jsonResult.result);
    	        	}
    	        }
			});
		});
		 // 添加语种能力
		$("#addbtn").click(function(){
			var index = $("select[name='ablityIds']").length + 1;
			var appendHtml = "";
			appendHtml += '<p id="ability_id_' + idIndex + '">';
			appendHtml += '<span name="ability_label" class="span-left">译员第' + index + '外语</span>';
			appendHtml += '<select class="slt" name="ablityIds">';
			appendHtml += '<option value="1">中文</option>';
			appendHtml += '<option value="2">英文</option>';
			appendHtml += '<option value="3">日文</option>';
			appendHtml += '<option value="4">法文</option>';
			appendHtml += '<option value="5">德文</option>';
			appendHtml += '<option value="6">俄文</option>';
			appendHtml += '<option value="7">韩文</option>';
			appendHtml += '<option value="9">荷兰语</option>';
			appendHtml += '<option value="10">意大利语</option>';
			appendHtml += '<option value="11">西班牙文</option>';
			appendHtml += '<option value="12">葡萄牙语</option>';
			appendHtml += '<option value="20">泰语</option>';
			appendHtml += '</select>';
			appendHtml += '<button class="delspan" onclick="delAbility(' + idIndex + ')">删除</button>';
			appendHtml += '</p>';
			$(".inner-form").append(appendHtml);
			idIndex++;
		});
	});
	
	function delAbility(abilityId){
		$("#ability_id_" + abilityId).remove();
		$("span[name='ability_label']").each(function(index,element){
			$(this).html("译员第" + (index + 1) + "外语");
		});
	}
</script>
</body>
</html>